<!--我的融资-->
<template>
    <div>
        <div v-for="(item, index) in FinanceAllData" :key="index">
            <el-descriptions class="margin-top" :column="2" :size="size" title="我的融资信息" border style="width: 100%">
                <template #extra>
                    <!-- <span style="left"> 我的融资信息 {{index+1}}</span> -->
                    <el-button type="warning" size="small" v-if="item.status !== 2"
                        @click="updateFinaceShow(item.financeId)">修改</el-button>
                    <el-button type="danger" size="small" @click="deleteFinace(item.financeId)">删除</el-button>
                </template>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-user"></i>
                        姓名
                    </template>
                    {{ item.realName }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-mobile-phone"></i>
                        手机号
                    </template>
                    {{ item.phone }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-tickets"></i>
                        身份证号
                    </template>
                    {{ item.idNum }}
                </el-descriptions-item>

                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-money"></i>
                        融资金额
                    </template>
                    {{ item.money }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-office-building"></i>
                        银行
                    </template>
                    {{ getBankName(item.bankId) }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-s-release"></i>
                        利率
                    </template>
                    {{ item.rate }}
                </el-descriptions-item>

                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-warning-outline"></i>
                        申请状态
                    </template>
                    <el-tag type="warning" v-show="item.status === 0">申请中</el-tag>
                    <el-tag type="danger" v-show="item.status === 1">驳回</el-tag>
                    <el-tag type="success" v-show="item.status === 2">通过</el-tag>
                </el-descriptions-item>

                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-user"></i>
                        联合融资人1姓名
                    </template>
                    {{ item.combinationName1 }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-mobile-phone"></i>
                        联合融资人1手机号
                    </template>
                    {{ item.combinationPhone1 }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-tickets"></i>
                        联合融资人1身份证
                    </template>
                    {{ item.combinationIdnum1 }}
                </el-descriptions-item>

                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-user"></i>
                        联合融资人2姓名
                    </template>
                    {{ item.combinationName2 }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-mobile-phone"></i>
                        联合融资人2手机号
                    </template>
                    {{ item.combinationPhone2 }}
                </el-descriptions-item>
                <el-descriptions-item>
                    <template #label>
                        <i class="el-icon-tickets"></i>
                        联合融资人2身份证
                    </template>
                    {{ item.combinationIdnum2 }}
                </el-descriptions-item>
            </el-descriptions>
        </div>

        <el-dialog title="修改融资信息" v-model="showUpdate" width="580px" :before-close="closeUpdate">
            <el-form v-model="FinanceData" ref="ruleForm" label-width="100px" class="demo-ruleForm">
                <strong style="color: green">修改融资信息：</strong>
                <el-form-item label="融资额度：" prop="money">
                    <el-input v-model="FinanceData.money"></el-input>
                </el-form-item>

                <el-form-item label="意向借款期：" prop="repaymentPeriod">
                    <el-select v-model="value" placeholder="意向借款期：">
                        <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
                        </el-option>
                    </el-select>
                </el-form-item>

                <strong style="color: green">用户1：</strong>
                <el-form-item label="姓名：" prop="realName">
                    <el-input v-model="FinanceData.realName"></el-input>
                </el-form-item>
                <el-form-item label="联系方式：" prop="phone">
                    <el-input v-model="FinanceData.phone"></el-input>
                </el-form-item>
                <el-form-item label="身份证号：" prop="idNum">
                    <el-input v-model="FinanceData.idNum"></el-input>
                </el-form-item>

                <strong style="color: green">用户2：</strong>
                <el-form-item label="姓名：" prop="combinationName1">
                    <el-input v-model="FinanceData.combinationName1"></el-input>
                </el-form-item>
                <el-form-item label="联系方式：" prop="combinationPhone1">
                    <el-input v-model="FinanceData.combinationPhone1"></el-input>
                </el-form-item>
                <el-form-item label="身份证号：" prop="combinationIdnum1">
                    <el-input v-model="FinanceData.combinationIdnum1"></el-input>
                </el-form-item>

                <strong style="color: green">用户3：</strong>
                <el-form-item label="姓名：" prop="combinationName2">
                    <el-input v-model="FinanceData.combinationName2"></el-input>
                </el-form-item>
                <el-form-item label="联系方式：" prop="combinationPhone2">
                    <el-input v-model="FinanceData.combinationPhone2"></el-input>
                </el-form-item>
                <el-form-item label="身份证号：" prop="combinationIdnum2">
                    <el-input v-model="FinanceData.combinationIdnum2"></el-input>
                </el-form-item>
            </el-form>
            <span slot="footer" class="dialog-footer">
                <el-button @click="closeUpdate">取 消</el-button>
                <el-button type="success" @click="updateFinace">确定</el-button>
            </span>
        </el-dialog>
    </div>
</template>

<script setup>
import { selectByName, updateById, deleteById, selectFinaceById } from "@/api/finance.js";
import { ref } from "vue";
import { ElMessage, ElMessageBox } from 'element-plus'

const FinanceAllData = ref([]);
const showUpdate = ref(false);
const FinanceData = ref({
    money: '',
    rate: '',
    repaymentPeriod: '',
    realName: '',
    phone: '',
    idNum: '',
    combinationName1: '',
    combinationPhone1: '',
    combinationIdnum1: '',
    combinationName2: '',
    combinationPhone2: '',
    combinationIdnum2: '',
    bankId: ''
});
const value = ref(6);
const options = [
    {
        value: 6,
        label: "六个月",
    },
    {
        value: 12,

        label: "十二个月",
    },
    {
        value: 24,
        label: "一年",
    },
    {
        value: 36,
        label: "三年",
    },
];

const load = () => {
    FinanceData.value.money = ''
    FinanceData.value.repaymentPeriod = ''
    FinanceData.value.realName = ''
    FinanceData.value.phone = ''
    FinanceData.value.idNum = ''
    FinanceData.value.combinationName1 = ''
    FinanceData.value.combinationPhone1 = ''
    FinanceData.value.combinationIdnum1 = ''
    FinanceData.value.combinationName2 = ''
    FinanceData.value.combinationPhone2 = ''
    FinanceData.value.combinationIdnum2 = ''
    selectByName().then((res) => {
        if (res.flag == true) {
            FinanceAllData.value = res.data;
            console.log(res.data);
        } else {
            ElMessage.error(res.data);
        }
    });
}
load();


const getBankName = (bankId) => {
    if (bankId == "1005") {
        return "日照银行";
    }
    if (bankId == "1001") {
        return "青岛银行";
    }
    if (bankId == "1002") {
        return "中国银行";
    }
    if (bankId == "1004") {
        return "中国工商银行";
    }
    if (bankId == "1006") {
        return "华夏银行";
    }
    if (bankId == "1007") {
        return "中国建设银行";
    }
    if (bankId == "1008") {
        return "浦发银行";
    }
    if (bankId == "1009") {
        return "中国平安银行";
    }
    if (bankId == "1010") {
        return "中国民生银行";
    }

}

//取消
const closeUpdate = () => {
    showUpdate.value = false;
    load()
}


//修改
const updateFinaceShow = (id) => {
    showUpdate.value = true;
    FinanceData.value.financeId = id;
    selectFinaceById({ id }).then((res) => {
        FinanceData.value = res.data;
    });
}

const updateFinace = () => {
    if (FinanceData.value.money == '' || FinanceData.value.rate == '' || FinanceData.value.repaymentPeriod == '' || FinanceData.value.realName == '' || FinanceData.value.phone == '' || FinanceData.value.idNum == '' || FinanceData.value.combinationName1 == '' || FinanceData.value.combinationPhone1 == '' || FinanceData.value.combinationIdnum1 == '' || FinanceData.value.combinationName2 == '' || FinanceData.value.combinationPhone2 == '' || FinanceData.value.combinationIdnum2 == ''
        || FinanceData.value.fileInfo == undefined) {
        ElMessage.error('请填写完整信息')
    } else {
        let newFinance = {
            money: FinanceData.value.money,
            rate: FinanceData.value.rate,
            realName: FinanceData.value.realName,
            phone: FinanceData.value.phone,
            idNum: FinanceData.value.idNum,
            repayment: value.value,
            combinationName1: FinanceData.value.combinationName1,
            combinationPhone1: FinanceData.value.combinationPhone1,
            combinationIdnum1: FinanceData.value.combinationIdnum1,
            combinationName2: FinanceData.value.combinationName2,
            combinationPhone2: FinanceData.value.combinationPhone2,
            combinationIdnum2: FinanceData.value.combinationIdnum2,
            bankId: FinanceData.value.bankId,
            financeId: FinanceData.value.financeId
        }
        updateById(newFinance).then((res) => {
            if (res.flag == true) {
                ElMessage.success(res.message);
                load();
                showUpdate.value = false;
            } else {
                ElMessage.error(res.data);
            }
        });
    }
}


//删除
const deleteFinace = (id) => {
    ElMessageBox.confirm('确认删除该信息?', '提示', {
        confirmButtonText: '确定',
        cancelButtonText: '取消',
        type: 'warning',
    }).then(() => {
        deleteById({ id }).then((res) => {
            if (res.flag == true) {
                ElMessage.success(res.message);
                load();
            }
        })
    })
}


</script>

<style lang="scss" scoped>
.el-descriptions {
    padding-left: 20px;
    padding-right: 20px;
    padding-bottom: 20px;
}
</style>